<template>
  <div>
    <a-radio-group v-model="queryParam.chargeType" style="position: absolute;top: 8px;" @change="changeRadio">
      <a-radio-button :value="1">项目</a-radio-button>
      <a-radio-button :value="3">预存款</a-radio-button>
    </a-radio-group>
    <super-table
      ref="table"
      size="small"
      :columns="columns_no_charge"
      :data="loadData"
      :rowKey="(record,index)=> index"
      :scroll="{ x: 1300}"
    >
      <!--序号-->
      <template slot="index" slot-scope="text,record,index">
        <span>{{ (queryParam.pageNum - 1) * queryParam.pageSize + (index + 1) }}</span>
      </template>
      <!--客户卡号-->
      <template slot="cardNo" slot-scope="text,record">
        <div class="g-flex g-y-center">
          <a class="g-f-14" @click="toDetails(text, record)">{{ text }}</a>
          <a-tooltip placement="top">
            <template slot="title"> 复制 </template>
            <a-icon
              style="margin-left: 10px;cursor: pointer;"
              theme="twoTone"
              two-tone-color="#3399ff"
              type="copy"
              @click="ConCopy(text)"/>
          </a-tooltip>
        </div>
      </template>
      <!--状态-->
      <template slot="chargeState" slot-scope="text">
        <a-tag v-if="text==0" color="orange">未收款</a-tag>
        <a-tag v-else-if="text==1" color="orange">未收完</a-tag>
        <a-tag v-else-if="text==2" color="green">已收完</a-tag>
        <a-tag v-else-if="text==3" color="green">已作废</a-tag>
        <a-tag v-else>{{ text }}</a-tag>
      </template>
      <!-- 应收金额 -->
      <template slot="totalPayableAmt" slot-scope="text,record">
        <a-statistic :precision="2" :value="record.totalPayableAmt" :value-style="{ color: '#3f8600'}">
          <template #prefix>¥</template>
        </a-statistic>
      </template>
      <!-- 成交金额 -->
      <template slot="totalChargeAmt" slot-scope="text,record">
        <a-statistic :precision="2" :value="record.totalChargeAmt" :value-style="{ color: '#3f8600' }">
          <template #prefix>¥</template>
        </a-statistic>
      </template>
      <template slot="action" slot-scope="text,record">
        <div class="g-flex">
          <a-button class="g-bt-pad-0" type="link" @click="openDrawer(record)">项目</a-button>
          <a-button
            v-show="queryParam.chargeType!=3"
            class="g-bt-pad-0"
            type="link"
            @click="clickItemCharge(record)">收费</a-button>
          <a-button
            v-show="queryParam.chargeType==3"
            class="g-bt-pad-0"
            type="link"
            @click="clickDepositCharge(record)">收费</a-button>
          <a-button class="g-bt-pad-0" type="link" @click="returnCharge(record)">退回</a-button>
        </div>
      </template>

    </super-table>
  </div>
</template>

<script>
export default {
name: "TabNoCharge"
}
</script>

<style scoped>

</style>